|
この記事では、XPages Extension Library Mobile Controls から Tab Bar Button コントロールを解説します。
|
ShowTable of Contents
Tab Bar Button コントロールの概説
Tab Bar コントロール内に配置するボタンで、通常の XPages のボタンコントロール(xp:button)とは異なり、モバイルアプリケーションに特化したスタイルを提供します。このコントロールは必ず Tab Bar コントロール内に配置しなければなりません。
生成されるタグ
このコントロールのタグは xe:tabBarButton です。
<xe:tabBar id="tabBar1" inHeading="true"
barType="segmentedControl">
<xe:tabBarButton id="tabBarButton1"
icon1="/save_unselected.gif" icon2="/save_selected.gif">
</xe:tabBarButton>
<xe:tabBarButton id="tabBarButton2"></xe:tabBarButton>
<xe:tabBarButton id="tabBarButton3"></xe:tabBarButton>
</xe:tabBar>
Tab Bar Button のプロパティ
カテゴリ |
プロパティ |
説明 |
基本 |
icon1 |
このボタンが選択されていない時のアイコンイメージ |
|
icon2 |
このボタンが選択されている時のアイコンイメージ |
|
iconsPos1 |
上記の icon1 のイメージを表示する場所
デフォルトあるいは、次の 3 つを指定可
0,0,29,29
0,29,29,29
0,58,29,29
|
|
iconsPos2 |
上記の icon2 のイメージを表示する場所
デフォルトあるいは、次の 3 つを指定可
0,0,29,29
0,29,29,29
0,58,29,29
|
|
label |
ボタンに表示するテキスト
|
|
selected |
ボタンが選択されているかいないかを true、false で判別させる
|
|
selectOne |
デフォルトでは true で、ひとつのアイテムしか選択できない。false に変更すると複数のアイテムを選択できる |
|
transition |
次のページ遷移におけるトランジションのエフェクト。デフォルトはslide。その他のオプションとして fade, flip, none を指定可 |
|